<style scoped>
    .tax-code-tax-rate-page{}

</style>
<template> 
    <div class="tax-code-tax-rate-page">
        <el-form :inline="true" :model="formInline" class="demo-form-inline" style="border-bottom:1px solid #ccc;">
            <!--税码-->
            <el-form-item :label="nowLangue.taxCode" class="selectMB10">
                <el-input size="mini" v-model="formInline.taxCode" :placeholder="nowLangue.pleaseImport+nowLangue.taxCode"></el-input>
            </el-form-item>
            <!--税码描述-->
            <el-form-item :label="nowLangue.taxCodeDescription" class="selectMB10">
                <el-input size="mini" v-model="formInline.taxDec" :placeholder="nowLangue.pleaseImport+nowLangue.taxCodeDescription"></el-input>
            </el-form-item>
            <!--税率-->
            <el-form-item :label="nowLangue.taxRate" class="selectMB10">
                <el-input size="mini" v-model="formInline.tax" :placeholder="nowLangue.pleaseImport+nowLangue.taxRate" style="width:90px;"></el-input>
            </el-form-item>
            <!--当前状态-->
             <el-form-item :label="nowLangue.currStatus" class="selectMB10">
                <el-select size="mini" clearable v-model="formInline.status" :placeholder="nowLangue.pleaseSelect" style="width:90px;" >
                    <el-option v-for="(status,index) in statusLists" :key="index" :label="status.label" :value="status.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item class="selectMB10">
                <!--查询-->
                <el-button class="bolder outsideBtnBS selectAll" :disabled="selectDisabled" size="mini" type="danger" @click="queryTaxSheet()" v-text="nowLangue.query"></el-button>
            </el-form-item>
        </el-form>
        <!--表格-->
        <!--税码税率列表：-->
        <label class="default-label" v-text="nowLangue.ListOfTaxCodeRates"></label>
        <!--新增按钮-->
        <!--新增-->
        <el-button class="bolder outsideBtnBS" size="mini" type="danger" @click="createNew()" v-text="nowLangue.create"></el-button>
        <el-table :data="corFactoryData" border style="width: 100%;" v-loading.body="loading" element-loading-text="拼命加载中">
            <!--序-->
            <el-table-column type="index" header-align="center" align="center" :label="nowLangue.sequence"  width="40"></el-table-column>
            <!--操作-->
            <el-table-column :label="nowLangue.operate" header-align="center" align="center" width="80">
                <template scope="scope">
                    <!--禁用-->
                    <button class="operationItem bolder" v-if="scope.row.status" @click="handleStatus(scope.$index,scope.row)" v-text="nowLangue.forbidden" :disabled="statusDisabled"></button>
                    <!--启用-->
                    <button class="operationItem bolder" v-else @click="handleStatus(scope.$index,scope.row)" v-text="nowLangue.enable" :disabled="statusDisabled"></button>
                    <!--修改-->
                    <button class="operationItem disabled bolder" v-if="scope.row.status" v-text="nowLangue.update"></button>
                    <!--修改-->
                    <button class="operationItem bolder" v-else @click="updateTaxCodeTax(scope.$index,scope.row)" v-text="nowLangue.update"></button>
                </template>
            </el-table-column>
            <!--税码-->
            <el-table-column prop="taxCode" :label="nowLangue.taxCode" header-align="center" width="100" show-overflow-tooltip></el-table-column>
            <!--税码描述-->
            <el-table-column prop="taxDec" :label="nowLangue.taxCodeDescription" header-align="center" show-overflow-tooltip></el-table-column>
            <!--税率(%)-->
            <el-table-column prop="tax" :label="nowLangue.taxRateSign" header-align="center" width="100" show-overflow-tooltip></el-table-column>
            <!--状态-->
            <el-table-column prop="statusName" :label="nowLangue.status" header-align="center" align="center" width="80" show-overflow-tooltip></el-table-column>
        </el-table>
        <!--分页-->
        <el-pagination v-if="isPaging" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pageIndex"  :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :page-count="totalPage" :total="totalNumber"></el-pagination>
        <!--新建弹窗-->
        <!--新增税码信息-->
        <el-dialog :title="nowLangue.create+nowLangue.taxCodeMes" :visible.sync="dialogForm1Visible" size="tiny" :lock-scroll="false">
            <el-form :inline="true" :model="addTaxCodeForm" class="demo-form-inline label-minW80" style="border-bottom:1px solid #ccc;" ref="addTaxCodeForm"> 
                <!--税码-->
                <el-form-item :label="nowLangue.taxCode" prop="taxCode"  :rules="[{ required: true, message: nowLangue.required},{ max: 20, message: nowLangue.lessThan20}]" >
                    <el-input  v-model.trim="addTaxCodeForm.taxCode" :placeholder="nowLangue.pleaseImport+nowLangue.taxCode"></el-input>
                </el-form-item>
                <!--税码描述-->
                <el-form-item :label="nowLangue.taxCodeDescription" prop="taxDec"  :rules="[{ required: true, message: nowLangue.required},{ max: 200, message: nowLangue.lessThan200}]" >
                    <el-input  v-model.trim="addTaxCodeForm.taxDec" :placeholder="nowLangue.pleaseImport+nowLangue.taxCodeDescription"></el-input>
                </el-form-item>
                <!--税率-->
                <el-form-item :label="nowLangue.taxRate" prop="tax"  :rules="[{ required: true, message: nowLangue.required},{ max: 5, message: nowLangue.lessThan5}]" >
                    <el-input  v-model.trim="addTaxCodeForm.tax" :placeholder="nowLangue.pleaseImport+nowLangue.taxRate" style="width:100px;" @change="inputTax"></el-input>&nbsp;%
                </el-form-item>
                <!--状态-->
                <el-form-item :label="nowLangue.status"  >
                    <el-radio-group v-model="addTaxCodeForm.status">
                        <!-- 启用 -->
                        <el-radio :label="true" v-cloak>{{nowLangue.enable}}</el-radio>
                        <!-- 禁用 -->
                        <el-radio :label="false" v-cloak>{{nowLangue.forbidden}}</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <!--保存-->
                <el-button class="bolder outsideBtnBS" size="mini" type="danger" @click="saveTaxCodeTax" v-text="nowLangue.save" :disabled="saveTaxDisabled"></el-button>
                <!--取消-->
                <el-button class="bolder outsideBtnBS" size="mini" type="danger" @click="cancleTaxCodeTax" v-text="nowLangue.cancel"></el-button>
            </div>
        </el-dialog>
        <!--修改弹窗-->
        <!--修改税码信息-->
        <el-dialog :title="nowLangue.update+nowLangue.taxCodeMes" :visible.sync="dialogForm2Visible" size="tiny" :lock-scroll="false">
            <el-form :inline="true" :model="updateTaxCodeForm" class="demo-form-inline label-minW80" style="border-bottom:1px solid #ccc;" ref="updateTaxCodeForm">
                <!--税码-->
                <el-form-item :label="nowLangue.taxCode" prop="taxCode"  :rules="[{ required: true, message: nowLangue.required},{ max: 20, message: nowLangue.lessThan20}]" >
                    <el-input  v-model.trim="updateTaxCodeForm.taxCode" disabled></el-input>
                </el-form-item>
                <!--税码描述-->
                <el-form-item :label="nowLangue.taxCodeDescription" prop="taxDec"  :rules="[{ required: true, message: nowLangue.required},{ max: 200, message: nowLangue.lessThan200}]" >
                    <el-input  v-model.trim="updateTaxCodeForm.taxDec" :title="updateTaxCodeForm.taxDec"></el-input>
                </el-form-item>
                <!--税率-->
                <el-form-item :label="nowLangue.taxRate" prop="tax"  :rules="[{ required: true, message: nowLangue.required},{ max: 5, message: nowLangue.lessThan5}]" >
                    <el-input  v-model.trim="updateTaxCodeForm.tax" :placeholder="nowLangue.pleaseImport+nowLangue.taxRate" style="width:100px;" @change="inputTax"></el-input>&nbsp;%
                </el-form-item>
                <!--状态-->
                <el-form-item :label="nowLangue.status" >
                    <el-radio-group v-model="updateTaxCodeForm.status">
                        <!-- 启用-->
                        <el-radio :label="true" v-cloak>{{nowLangue.enable}}</el-radio>
                        <!-- 禁用 -->
                        <el-radio :label="false" v-cloak>{{nowLangue.forbidden}}</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <!--保存-->
                <el-button class="bolder outsideBtnBS" size="mini" type="danger" @click="saveUpdateTaxCodeTax" v-text="nowLangue.save" :disabled="saveUTaxDisabled"></el-button>
                <!--取消-->
                <el-button class="bolder outsideBtnBS" size="mini" type="danger" @click="cancelUpdateTaxCodeTax" v-text="nowLangue.cancel"></el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
       export default {
        data() {
            return {
                nowLangue:{},
                // 查询表单
                formInline:{
                    taxCode:"",//税码
                    taxDec:"",//税码描述
                    tax:"",//税率
                    status:""
                },
                statusLists:[],   //当前状态下拉列表
                labelWidth:"80px",
                addTaxCodeForm:{
                    taxCode:"",//税码
                    taxDec:"",//税码描述
                    tax:"",//税率
                    status:false
                },
                updateTaxCodeForm:{
                    taxCode:"",//税码
                    taxDec:"",//税码描述
                    tax:"",//税率
                    status:""
                },
                legalPersonDropDown:[], //法人名称
                corFactoryData:[],//法人工厂列表
                loading:false,
                disabled:false,


                //弹窗
                dialogForm1Visible:false,
                dialogForm2Visible:false,
                // 分页
                isPaging:false,
                pageIndex:1,    //当前页（必传）
                pageSize :10,   //每页多少条
                totalNumber: 20,
                totalPage:2,
                
                //查询禁用
                selectDisabled:false,
                statusDisabled:false,      //启用禁用操作按钮禁用
                saveTaxDisabled:false,    //新增弹窗中保存操作按钮禁用
                saveUTaxDisabled:false,    // 修改弹窗中保存操作按钮禁用
                //税率为数字
                taxIsNumber:true
            };
        },
        created:function(){
            var _this=this;
            _this.languageType=="zh"?_this.nowLangue=_this.language.zh:_this.nowLangue=_this.language.en;
        },
        computed:{
            // powerData(){
            //     return this.$store.state.powerData;
            // },
            languageType(){
                return this.$store.state.languageType;
            }
        },
        watch:{
            languageType(){
                var _this=this;
                _this.languageType=="zh"?_this.nowLangue=_this.language.zh:_this.nowLangue=_this.language.en;
            }
        },
       //进入页面立即运行此方法
       mounted: function () {
            var _this = this;
            _this.$store.commit('currentActive', 'TaxCodeTaxRate');
            // //ajax前后查询按钮禁用
            // $(".selectAll").ajaxStart(function(){
            //     _this.selectDisabled=true;
            // });
            // $(".selectAll").ajaxStop(function(){
            //     _this.selectDisabled=false;
            // });
            _this.dropDownValue();// 当前状态下拉列表
            _this.queryTaxSheet();    //表单查询
       },
        methods:{
            // 当前状态下来列表
            dropDownValue(){
                var _this=this;
                var tmp=["tax.taxStatus"];
                $.ajax({
                    type:'POST',
                    url:_this.metadata_service+'metadata/getPullDownList',
                    cache:false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType:"application/json;charset=utf-8",
                    success:function(data){
                        if(data.success){
                            _this.statusLists=data.data['tax.taxStatus'];
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                    }
                })
            },
            //查询税码税率列表
            queryTaxSheet(){
                var _this=this;
                _this.loading=true;
                var tmp={
                    taxCode:_this.formInline.taxCode,
                    taxDec:_this.formInline.taxDec,
                    tax:_this.formInline.tax,
                    status:_this.formInline.status,
                    pageIndex:_this.pageIndex,
                    pageSize:_this.pageSize
                };
                _this.selectDisabled=true;
                $.ajax({
                    type: 'POST',
                    url: _this.metadata_service+"tax/queryPage",
                    cache: false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType: "application/json;charset=utf-8",
                    success: function (data) {
                        if (data.success) {
                            _this.loading=false;
                            _this.isPaging=true;
                            _this.totalPage=data.data.totalPage;
                            _this.totalNumber=data.data.totalNumber;
                            _this.corFactoryData=data.data.dataList;
                        }else{
                            _this.common.errorTip(data.errorMessage)
                        }
                        _this.selectDisabled=false;
                    }
                });
            },
            // 输入税率
            inputTax(val){
                var _this=this;
                if(!(/^\d+(\.\d+)?$/.test(val))){
                    var err=_this.languageType=="zh"?"税率必须为数字！":"The tax rate must be numeric";
                    _this.common.errorTip(err);
                    _this.taxIsNumber=false;
                }else{
                    _this.taxIsNumber= true;
                }
            },
            //新增税码税率信息
            createNew(){
                var _this=this;
                _this.dialogForm1Visible=true; 
                if(this.$refs['addTaxCodeForm']) {
                    this.$refs['addTaxCodeForm'].resetFields();
                }
                _this.addTaxCodeForm.taxCode="";
                _this.addTaxCodeForm.taxDec="";
                _this.addTaxCodeForm.tax="";
                _this.addTaxCodeForm.status=false;
            },
            //新建保存
            saveTaxCodeTax(){
                var _this=this;
                _this.$refs["addTaxCodeForm"].validate((valid) => {
                    if (valid) {
                        if(_this.taxIsNumber){
                            var tmp={
                                taxCode:_this.addTaxCodeForm.taxCode,   //去除税码两边的空格
                                taxDec:_this.addTaxCodeForm.taxDec,
                                tax:_this.addTaxCodeForm.tax,
                                status:_this.addTaxCodeForm.status,
                            };
                            _this.saveTaxDisabled=true;
                            $.ajax({
                                type: 'POST',
                                url: _this.metadata_service+"tax/save",
                                cache: false,
                                data:JSON.stringify(tmp),
                                dataType:'JSON',
                                contentType: "application/json;charset=utf-8",
                                success: function (data) {
                                    if (data.success) {
                                        var success=_this.languageType=="zh"?'保存成功':'Save Success';
                                        _this.common.successTip(success);
                                        _this.dialogForm1Visible=false;
                                        _this.queryTaxSheet();
                                    }else{
                                        _this.common.errorTip(data.errorMessage);
                                    }
                                    _this.saveTaxDisabled=false;
                                }
                            });
                        }else{
                            var err=_this.languageType=="zh"?"税率必须为数字！":"The tax rate must be numeric";
                            _this.common.errorTip(err);
                        }
                    } else {
                        var  err=_this.common.formErrorInfo();
                        _this.common.errorTip(err);
                        return false;
                    }
                });
            },
            //新建取消
            cancleTaxCodeTax(){
                var _this=this;
                _this.dialogForm1Visible=false;
                if(this.$refs['addTaxCodeForm']) {
                    this.$refs['addTaxCodeForm'].resetFields();
                }
                _this.addTaxCodeForm.taxCode="";
                _this.addTaxCodeForm.taxDec="";
                _this.addTaxCodeForm.tax="";
                _this.addTaxCodeForm.status=false;
            },
            // 操作启用禁用
            handleStatus(index, row){
                var _this=this;
                if(row.status){
                    row.status = false;
                }else{
                    row.status = true;
                }
                var tmp={id: row.id,status: row.status}; 
                _this.statusDisabled=true;
                $.ajax({
                    type: 'POST',
                    url: _this.metadata_service+"tax/updateStatus",
                    cache: false,
                    data:JSON.stringify(tmp),
                    dataType:'JSON',
                    contentType: "application/json;charset=utf-8",
                    success: function (data) {
                        if (data.success) {
                            // 当前状态的显示
                            if(row.status){
                                row.statusName = "启用";
                                var success=_this.languageType=="zh"?'启用成功':'Enable success';
                                _this.common.successTip(success);
                            }else{
                                row.statusName = "禁用";
                                var success=_this.languageType=="zh"?'禁用成功':'Disable success';
                                _this.common.successTip(success);
                            }
                        }else{
                            _this.common.errorTip(data.errorMessage);
                        }
                        _this.statusDisabled=false;    
                    }
                });
            },
            //点击修改
            updateTaxCodeTax(index,row){
                var _this=this;
                _this.dialogForm2Visible=true;
                if(this.$refs['updateTaxCodeForm']) {
                    this.$refs['updateTaxCodeForm'].resetFields();
                 }
                 _this.updateTaxCodeForm.id = row.id;
                 _this.updateTaxCodeForm.taxCode = row.taxCode;
                 _this.updateTaxCodeForm.taxDec = row.taxDec;
                 _this.updateTaxCodeForm.tax = String(row.tax);
                 _this.updateTaxCodeForm.status = row.status;
            },
            //修改保存
            saveUpdateTaxCodeTax(){
                var _this=this;
                _this.$refs["updateTaxCodeForm"].validate((valid) => {
                    if (valid) {
                        if(_this.taxIsNumber){
                            var tmp={
                                id:_this.updateTaxCodeForm.id,
                                taxCode:_this.updateTaxCodeForm.taxCode,
                                taxDec:_this.updateTaxCodeForm.taxDec,
                                tax:_this.updateTaxCodeForm.tax,
                                status: _this.updateTaxCodeForm.status
                                };
                            _this.saveUTaxDisabled=true;
                            $.ajax({
                                type: 'POST',
                                url: _this.metadata_service+"tax/update",
                                cache: false,
                                data:JSON.stringify(tmp),
                                dataType:'JSON',
                                contentType: "application/json;charset=utf-8",
                                success: function (data) {
                                    if (data.success) {
                                        var success=_this.languageType=="zh"?'修改成功！':'Modify successfully';
                                        _this.common.successTip(success);
                                        _this.dialogForm2Visible=false;
                                        _this.queryTaxSheet();
                                    }else{
                                        _this.common.errorTip(data.errorMessage);
                                    }
                                    _this.saveUTaxDisabled=false;    
                                }
                            });
                        }else{
                            var err=_this.languageType=="zh"?"税率必须为数字！":"The tax rate must be numeric";
                            _this.common.errorTip(err);
                        }
                    } else {
                        var  err=_this.common.formErrorInfo();
                        _this.common.errorTip(err);
                        return false;
                    }
                });
            },
            //修改取消
            cancelUpdateTaxCodeTax(){
                var _this=this;
                _this.dialogForm2Visible=false;
            },
            //   分页
            handleSizeChange(val) {
                var _this=this;
                _this.pageSize=val;
                _this.queryTaxSheet();

            },
            //点击页码分页查询点击事件
            handleCurrentChange(val) {
                var _this=this;
                _this.pageIndex=val;
                _this.queryTaxSheet();
            }
        }
    }
</script>



